<template>
  <div>
    ChildSlot<br>

    test:{{test}}<br>


    <slot v-bind:student="student">嘿嘿 我是后备</slot>
    <br>
    <!--    绑定在 <slot> 元素上的特性被称为插槽 prop-->
    <slot name="head" v-bind:student="student" :people="people">head+{{student.name}}</slot>
    <br>
    <slot name="body" v-bind:people="people">body+{{student.age}}</slot>
    <br>
    <slot name="foot" v-bind:student="student">foot+{{student.sex}}</slot>
    <br>
  </div>
</template>

<script>
  export default {
    name: "ChildSlot",
    props: ['test'],
    data() {
      return {
        student: {
          name: 'huang gang',
          age: 10,
          sex: 'man'
        },
        people: {
          name: 'kobe'
        }
      }
    }
  }
</script>

<style scoped>

</style>
